<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/html">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title></title>

    <link href="/styles/base.css" rel="stylesheet" type="text/css">
    <link href="/styles/travelspot.css" rel="stylesheet" type="text/css">
    <link href="/styles/reply.css" rel="stylesheet" type="text/css">
    <link href="/styles/select.css" rel="stylesheet" type="text/css">
    <link href="/js/plugins/jqPaginator/jqPagination.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="/js/jquery/jquery.min.js"></script>

    <link href="/styles/replyDetail.css" rel="stylesheet" type="text/css">
    <script type="text/javascript" src="/js/common.js"></script>
    <link rel="stylesheet" href="/js/bootstrap/css/bootstrap.css">
    <script src="/js/bootstrap/js/bootstrap.js"></script>

    <script type="text/javascript" src="/js/plugins/jqPaginator/jq-paginator.min.js"></script>

    <script type="text/javascript" src="/js/plugins/jquery-form/jquery.form.js"></script>
    <script type="text/javascript" src="/js/system/guide.js"></script>


</head>

<script>
    $(function () {
        $(".btn-reviews").click(function () {
            $("#myModal").modal('show');
        })

        //提交评论表单
        $(".btn-submit").click(function () {
            $("#scenicForm").ajaxSubmit(function (data) {
                alert(data);
            })
            /* $.post("/scenic/CommentSave",$("#scenicForm").serialize(),function (data) {
                 alert(data);
             })*/
        })

        //评论的评论
        $('.btn_submit_reply').click(function () {
            var id =  $(this).prev("textarea").attr("data-commentId");
            var scenicId = $(this).prev("textarea").attr("data-scenicId");
            var type = $(this).prev("textarea").attr("data-type");
            var comment = $(this).prev("textarea").val();
            $.post("/scenic/CommentSave",{id:id,scenicId:scenicId,type:type,comment:comment},function (data) {
                if (data.success) {
                    window.location.reload();
                }else {
                    alert(data.msg);
                }
            })
        })

        //点赞
        $(".useful").click(function () {
            var id = $(this).data("id");

            $.get("/scenic/scenicThumbup", {id: id}, function (data) {
                if (data.success) {
                    window.location.reload();
                }
            })
        })
    })
</script>

<body>
    <#assign currentNav="destination">
    <#include "../common/navbar.ftl">
<div id="container">
    <div class="row row-placeTop row-bg">
        <div class="wrapper">
            <div class="extra">
                <div class="action">
                    <a class="btn-collect" href="javascript:void(0)" _iswg="0" _mddid="14674" data-act="want_go"
                       class="icon"></i>收藏</a>
                    <a class="btn-been" href="javascript:void(0)" _ispa="0" _mddid="14674" data-act="set_path"><i
                            class="icon"></i>去过</a>
                </div>
            </div>


            <div class="crumb">
                <div class="item"><a href="/destination">目的地</a><em>&gt;</em></div>
                    <#list toasts as t>
                        <div class="item">
                            <div class="drop">
                                <span class="hd"><a href="javascript:;" target="_blank">${(t.name)!}<i></i></a></span>
                                <div class="bd">
                                    <i class="arrow"><b></b></i>
                                    <div class="col">
                                        <h3>热门地区</h3>
                                        <ul class="clearfix">
                                            <#list t.children as tc>
                                                <#if tc_index lt 5 >
                                                <li><a href="javascript:;" target="_blank">${tc.name}</a></li>
                                                </#if>
                                            </#list>

                                        </ul>
                                    </div>
                                    <div class="more"><a href="/destination/guide?id=${t.id}" target="_blank">&gt;&gt;更多地区</a>
                                    </div>
                                </div>
                            </div>
                            <em>&gt;</em>
                        </div>
                    </#list>
                <div class="item">
                    <div class="drop">
                        <span class="hd"><a href="javascript:;">${dest.name}<i></i></a></span>
                        <div class="bd">
                            <i class="arrow"><b></b></i>
                            <div class="col">
                                <!--h3>热门国家</h3-->
                                <ul class="clearfix">
                                    <li><a href="#" target="_blank">${dest.name}概况</a></li>
                                    <li><a href="/destination/scenic?destId=${dest.id}" target="_blank">${dest.name}
                                        景点</a></li>
                                    <li><a href="/travel?destId=${dest.id!}" target="_blank">${dest.name}游记</a></li>
                                    <li><a href="/strategy/list?destId=${dest.id!}" target="_blank">${dest.name}攻略</a>
                                    </li>
                                    <li><a href="javascript:;" target="_blank">${dest.name}跟团游</a></li>
                                </ul>
                            </div>
                            <!--div class="more"><a href="#">&gt;&gt;更多国家</a></div-->
                        </div>
                    </div>
                    <em>&gt;</em>
                </div>
                <div class="item cur"><strong>${dest.name}景点</strong></div>
            </div>


            <div class="title" style="position: relative;">
                <h1>${scenic.name}</h1>
                <a class="num-photo" href="javascript:;" target="_blank"></a>
                <br>
                <div style="position: absolute;top: 3px;right: 220px;"><img
                        src="https://b3-q.mafengwo.net/s12/M00/84/BF/wKgED1v-df2Ab5KFAAFioLPYatQ535.png"
                        style="width: 390px;"></div>
            </div>
            <div class="place-navbar" style="border-top: 0;">
                <div class="navbar-con">
                    <ul class="navbar clearfix navbar-first-level-warper">
                        <li class="navbar-overview city-guide">
                            <a class="navbar-btn" href="/destination/surveyPage?destId=${dest.id}">
                                <i class="navbar-icon"></i><span>概况</span>
                            </a>
                        </li>
                        <li class="navbar-line">
                            <a class="navbar-btn" href="/travel?destId=${dest.id!}">
                                <i class="navbar-icon"></i><span>游记</span>
                            </a>
                        </li>
                        <li class="navbar-line">
                            <a class="navbar-btn navbar-local" href="/strategy/list?destId=${dest.id!}">
                                <i class="navbar-icon"></i><span>攻略</span>
                            </a>
                        </li>
                        <li class="navbar-line">
                            <a class="navbar-btn navbar-sales" href="javascript:;">
                                <i class="navbar-icon"></i><span>跟团游</span>
                            </a>
                        </li>
                    </ul>

                </div>
            </div>
            <!-- 快捷导航 S-->
            <div style="height: 60px;">
                <div class="r-nav" id="poi-navbar" data-cs-p="快捷导航">
                    <ul class="clearfix">
                        <li data-scroll="overview" class="on">
                            <a title="概况">概况</a>
                        </li>
                        <li data-scroll="navbar-line">
                            <a title="蜂蜂点评" href="#commentlist">蜂蜂点评<span>（5592条）</span></a>
                        </li>


                        <li data-scroll="comment" class="nav-right">
                            <a class="btn-reviews" title="我要点评">我要点评</a>
                        </li>
                    </ul>
                </div>
            </div>

        </div>
    </div>
</div>

<div class="container" data-cs-t="景点详情页">

<div data-anchor="overview">
    <div class="row row-picture row-bg">
        <div class="wrapper">
            <div class="bd">
                <img src="${(scenic.coverUrl)!}"
                     width="750" height="400">
            </div>
        </div>

        <!-- 简介 S -->
        <div class="mod mod-detail" data-cs-p="概况">
        ${(scenic.content)!}
        </div>

        <!-- 内部景点 S -->
        <div data-anchor="subPoilist">
            <div id="pagelet-block-bb456ee5b764682811223f9b8d30739e" class="pagelet-block"
                 data-api=":poi:pagelet:poiSubPoiApi" data-params="{&quot;poi_id&quot;:&quot;25091&quot;}"
                 data-async="1"
                 data-controller="/js/poi/ControllerPoiSubPoi">
                <div class="mod mod-innerScenic" data-cs-p="内部景点">
                    <div class="mhd">内部景点</div>

                    <div class="mbd">
                        <ul class="clearfix">
                            <#list pageInfo.list as p>
                                <li>
                                    <a href="/poi/5174512.html" target="_blank" title="六榕寺">
                                        <img src="${(p.coverUrl)!}"
                                             width="235" height="150">
                                        <span class="num num-top">${p_index+1}</span>
                                        <div class="info">
                                            <h3>${(p.name)}</h3>
                                            <span><em>${(p.replynum)!   }</em>人去过</span>
                                        </div>
                                    </a>
                                </li>
                            </#list>
                        </ul>
                    </div>
                    <div class="more more-subpoi">
                        <a class="btn-subpoi" data-page="1">查看更多</a>
                    </div>
                </div>
                <style>
                    .mod-innerScenic .more {
                        margin-top: 20px;
                        text-align: center;
                    }

                    .mod-innerScenic .more a {
                        display: inline-block;
                        width: 160px;
                        height: 50px;
                        background-color: #fff;
                        border: 1px solid #fc9c27;
                        line-height: 50px;
                        color: #ff9d00;
                        font-size: 14px;
                        border-radius: 4px;
                        text-align: center;
                    }

                    .mod-innerScenic .num {
                        width: 40px;
                    }
                </style>
            </div>
        </div>
    </div>
</div>

<!--评论-->
<div data-anchor="commentlist">
    <div id="pagelet-block-15f9d6d9ad9f6c363d2d27120e8a6198" class="pagelet-block"
         data-api=":poi:pagelet:poiCommentListApi" data-params="{&quot;poi_id&quot;:&quot;25091&quot;}"
         data-async="1"
         data-controller="/js/poi/ControllerPoiComment">
        <div class="mod mod-reviews" data-cs-p="评论列表">
            <div class="mhd mhd-large"><a href="javascript:;"
                                          name="commentlist">蜂蜂点评<span>（共有<em>5592</em>条真实评价）</span></a></div>
            <div class="review-nav">
                <ul class="clearfix">
                    <li data-type="0" data-category="0" class="on"><span class="divide"></span><a
                            href="javascript:void(0);"><span>全部</span></a></li>
                    <li data-type="0" data-category="2" class="">
                        <span class="divide"></span>
                        <a href="javascript:void(0);">
                            <span>有图</span>
                            <span class="num"> (1356条)</span>
                        </a>
                    </li>
                </ul>
            </div>

            <div class="loading-img" style="display: none;"><img
                    src="http://images.mafengwo.net/images/weng/loading3.gif"> Loading...
            </div>
            <div class="_j_commentlist">
                <div class="rev-list">
                    <ul>

                        <#list query! as comment >
                            <li class="rev-item comment-item clearfix">
                                <div class="user"><a class="avatar" href="/mine/homepage?uid=${comment.userId}" target="_blank"><img
                                        src="http://b1-q.mafengwo.net/s10/M00/3D/07/wKgBZ1neKm2AcOhrAB5yLMoWpHI47.jpeg?imageMogr2%2Fthumbnail%2F%2148x48r%2Fgravity%2FCenter%2Fcrop%2F%2148x48%2Fquality%2F90"
                                        width="48" height="48"></a><span class="level">${comment.level}</span></div>
                                <a class="useful" data-id="${comment.id}" title="点赞">
                                    <i></i><span class="useful-num">${comment.thumbupnum}</span>
                                </a>
                                <span>${(comment.createTime)?string("yyyy-MM-dd")}</span></br>
                                <a class="name" href="/u/52068941.html" target="_blank">${comment.username}</a>
                                <span class="s-star s-star${comment.rank}"></span>
                                <p class="rev-txt">
                                    ${comment.comment}
                                </p>


                                    <div class="rev-img">
                                        <a href="/photo/poi/25091_440424016.html" target="_blank">
                                            <img src="${(comment.commentUrl)!}">
                                        </a>
                                    </div>
                                <div class="comment add-reply ">

                                    <ul class="more_reply_box comment_list">
                                        <#list comment.comments as cc>
                                        <li>
                                            <a href="/mine/homepage?uid=${cc.userId}" target="_blank">
                                                <img src="${cc.headUrl}"
                                                     width="16" height="16">${cc.username}
                                            </a>
                                            ：${cc.comment}
                                            <a class="_j_reply re_reply" data-id="625204" data-uid="63107989"
                                               data-username="🍓辣辣辣辣王🍓" title="添加回复">回复</a>
                                            <br><span class="time">${(cc.createTime)?string("yyyy-MM-dd")}</span>
                                        </li>
                                        </#list>
                                    </ul>

                                    <div class="add-comment  reply-form">
                                        <textarea class="comment_reply" id="commentReply"
                                                  data-commentId="${comment.id}" data-scenicId="${comment.scenicId}" data-type="1"
                                                  style="overflow: hidden; color: rgb(204, 204, 204);"></textarea>
                                        <a class="btn btn_submit_reply">回复</a>
                                    </div>
                                </div>
                            </li>
                        </#list>

                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>

</div>
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                        aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">景点点评</h4>
            </div>


            <div class="mfw-reviews">
                <div id="_j_commentform_cnt">
                    <h2>
                        <strong>广州塔</strong>
                        <em>*</em>为必填选项
                    </h2>
                    <form action="/scenic/CommentSave" method="post" id="scenicForm" class="_j_commentdialogform"
                          data-typeid="3">
                        <input type="hidden" name="scenicId" value="${scenic.id}">
                        <div class="review-item item-star">
                            <div class="label"><em>*</em>总体评价</div>
                            <div class="review-star _j_rankblock" data-star="" name="rank">
                                <input type="hidden" name="rank" value="" essential="1" data-inputname="总体评价">
                                <span class="_j_starcount star0"></span>
                                <div class="click-star _j_starlist">
                                    <a role="button" title="千万别去" rel="nofollow"></a>
                                    <a role="button" title="不推荐" rel="nofollow"></a>
                                    <a role="button" title="一般般" rel="nofollow"></a>
                                    <a role="button" title="值得一去" rel="nofollow"></a>
                                    <a role="button" title="必须推荐" rel="nofollow"></a>
                                </div>

                            </div>
                            <span class="txt-tips _j_startip">点击星星打分</span>
                        </div>

                        <div class="review-item item-comment">
                            <div class="label"><em>*</em>评价</div>
                            <div class="content">
                                <textarea class="_j_commentarea" name="comment" essential="1" data-inputname="点评内容"
                                          placeholder="详细、客观、真实，130字以上为佳！上传图片会加分哦！" data-minlen="15"
                                          data-maxlen="1000"></textarea>
                                <p class="_j_commentcounttip">15-1000个字</p>
                            </div>
                        </div>

                        <div class="review-item item-photo">
                            <div class="label">上传照片</div>
                            <div class="content">
                                <dl class="upload-box _j_piclist">
                                    <dd data-commentid="" id="_j_addpicbtns" ids="0" style="position: relative;">
                                        <a class="add-place"><i></i></a>
                                        <div id="html5_1dfo6usgd1maqh5812ivtkf1n223_container"
                                             class="moxie-shim moxie-shim-html5"
                                             style="position: absolute; top: 0px; left: 0px; width: 120px; height: 120px; overflow: hidden; z-index: -1;">
                                            <input id="html5_1dfo6usgd1maqh5812ivtkf1n223" type="file"
                                                   style="font-size: 999px; opacity: 0; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%;"
                                                   multiple="" accept="image/jpeg,image/gif,image/png,.JPEG"></div>
                                    </dd>
                                </dl>
                            </div>
                        </div>
                        <div class="review-item item-action">
                            <a class="btn-large _j_submit" role="button" title="提交点评">提交点评</a>
                        </div>
                    </form>
                </div>
            </div>
            <script type="text/javascript">

                $(function () {
                    $("._j_starlist a").mouseover(function () {
                        var index = $(this).index() + 1;
                        var text = $(this).attr("title");

                        $(this).closest("div").prev().addClass("star" + index);
                        $(this).closest("div").parent().next().html(text);
                    }).mouseout(function () {
                        var index = $(this).index() + 1;
                        var text = $(this).attr("title");
                        $(this).closest("div").prev().removeClass("star" + index);
                        $(this).closest("div").parent().next().html(text);

                        var x = $(this).closest("div").prev().prev().val();
                        if (x == index) {
                            $(this).closest("div").prev().addClass("star" + x);
                        }


                    }).click(function () {
                        var index = $(this).index() + 1;
                        var text = $(this).attr("title");
                        $(this).closest("div").prev().addClass("star" + index);
                        $(this).closest("div").parent().next().html(text);

                        $(this).closest("div").prev().prev().val(index);

                    })
                })

            </script>


            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary btn-submit">提交</button>
            </div>
        </div>
    </div>
</div>



    <#include "../common/footer.ftl">
</body>

</html>